<template>
	<view class="container">
		<view class="video-view" v-if="activeData" >
			<video class="video" :src="activeData.videoUrl" controls @play="onPlay" @pause="onPause" enable-play-gesture="true"></video>
		</view>
		<view class="title-view">
			<text class="name">{{activeData.knowledgeName}}</text>
			<view class="count"><uni-icons type="videocam" size="25"></uni-icons><text>{{activeData.count}}次</text></view>
			<text class="time">上传时间：{{activeData.createTime}}</text>
		</view>
		<view class="list-view" v-for="(item,index) in list" :index="index" :key="index" @click="clickItem(item)">
			<view class="imgView">
				<image :src="item.imgUrl" mode="heightFix"></image>
			</view>
			<view class="textView">
				<text>{{item.knowledgeName}}</text>
				<text> {{item.teacher}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import isEmpty from '@/components/isEmpty/isEmpty'
	import { getCourseDetail,creatCourse ,getCourseList} from '@/api/exam/activity'
	import {parseTime } from '@/utils/ruoyi'
	export default {
		data() {
			return {
				pageForm:{
					pageNo:1,
					pageSize:6
				}	,
				courseId:null,
				list:[],
				activeData:null,
				startTime:null,
			}
		},
		onLoad(e) {
			this.courseId = e.courseId
			this.getDetail()
			
		},
		onUnload(){
			this.creat();
		},
		methods: {
			getDetail(){
				let data = {
					id : this.courseId
				}
				getCourseDetail(data).then(res =>{
					this.activeData = res.data
					this.activeData.createTime = parseTime(this.activeData.createTime,'{y}-{m}-{d}')
					uni.setNavigationBarTitle({ title: this.activeData.knowledgeName });
					this.getList(this.activeData.categoryId)
				})
				 
				this.startTime = new Date().getTime();
			},
			getList(categoryId){
				this.pageForm.categoryId = categoryId
				getCourseList(this.pageForm).then(res =>{
					this.list = res.data.list
					console.log(this.list)
				})
			},
			clickItem(e){
				this.$tab.navigateTo('/pages/course/courseDetail?courseId=' + e.id)
			},
			close() {
				this.creat();
				//this.activeData = null
			},
			onPlay(){
			},
			onPause(){
				console.log('暂停了')
			},
			//新增播放记录
			creat(){
				let endTime = new Date().getTime()
				let data={
					courseId:this.courseId,
					studentId:uni.getStorageSync('studentId'),
					status:0,
					endTime:endTime,
					studyTime: endTime- this.startTime,
				}
				creatCourse(data).then(res =>{
				})
			}
		}
	}
</script>

<style lang="scss">
	.container{
		.video-view{
			width: 750rpx;
			.video{
				width: 750rpx;
			}
		}
		.title-view{
			display: flex;
			padding: 20rpx;
			justify-content: space-between;
			align-items: center;
			font-size: 12px;
			font-family: Inter-Regular, Inter;
			font-weight: 400;
			border-bottom: 1px solid rgba(151,151,151,0.5);
			.count{
				display: flex;
				align-items: center;
				font-size: 10px;
				color: #5E5E5E;
			}
			.time{
				color: #5E5E5E;
			}
		}
		.list-view{
			display: flex;
			overflow: hidden;
			border-bottom: 1px solid rgba(151,151,151,0.5);
			padding: 10px;
			.imgView{
				width: 112px;
				height: 89px;
				overflow: hidden;
			}
			.textView{
				padding-left: 20rpx;
				text{
					display: block;
					line-height: 80rpx;
				}
			}
		}
		
	}
	
</style>